<template>
  <div>
    <div>
      <yz-condition-filter
        v-model="queryParams"
        @resetSearch="resetSearch"
        @onSubmit="onSubmit"
        style="margin-top: 4px;"
      >
        <yz-input v-model="queryParams.taskState"
                  inputType="select"
                  :options="taskStatus"
                  title="任务状态"
                  class="margin-r-20"
        />

        <yz-input v-model="queryParams.exeCycle"
                  v-if="!showDriver"
                  inputType="select"
                  :options="cycleList"
                  title="执行周期"
                  class="margin-r-20"
        />

        <yz-input v-model="queryParams.startRange"
                  inputType="date"
                  title="开始日期"
                  class="margin-r-20 margin-b-20"
        />

        <fuzzy-search
          v-if="showDriver"
          v-model.trim="queryParams.driver"
          :isShowValue="false"
          showAllOption
          isFilter
          smallSize
          title="驱动名称"
          filterByFe
          :options="driverList"
          class="margin-r-20"
        ></fuzzy-search>

        <fuzzy-search
          v-if="showDriver"
          v-model.trim="queryParams.version"
          :isShowValue="false"
          showAllOption
          isFilter
          smallSize
          title="版本号"
          filterByFe
          class="margin-r-20"
          :options="versionList"
        ></fuzzy-search>

        <fuzzy-search
          v-model.trim="queryParams.ownerId"
          :isShowValue="false"
          showAllOption
          isFilter
          smallSize
          title="创建人"
          filterByFe
          :options="createUserList"
        ></fuzzy-search>
      </yz-condition-filter>
    </div>
    <div class="form-inline">
      <q-btn outline color="primary" label="新增" @click="goAdd" />
    </div>
  </div>
</template>

<script>
import { taskStatus, cycleList } from '../constant'
import _ from 'lodash'

const cycleListAll = _.clone(cycleList)
cycleListAll.unshift({ label: '全部', value: '' })
export default {
  name: 'task-search',
  props: {
    taskType: {
      type: String,
      default: ''
    },
    createUserList: {
      type: Array,
      default: () => []
    },
    driverListObj: {
      type: Object,
      default: () => {}
    }
  },
  data () {
    return {
      taskStatus: taskStatus,
      cycleList: cycleListAll,
      queryParams: {
        taskState: '',
        exeCycle: '',
        startRange: null,
        ownerId: '',
        driver: '',
        version: ''
      }
    }
  },
  computed: {
    driverList () {
      return Object.keys(this.driverListObj).map(key => ({ label: key, value: key }))
    },
    versionList () {
      if (this.queryParams.driver) {
        const version = this.driverListObj[this.queryParams.driver] || []
        return version.map(v => ({ label: v, value: v }))
      }
      return []
    },
    showDriver () {
      return this.taskType === '4'
    }
  },
  methods: {
    // 重置
    resetSearch () {
      Object.assign(this.queryParams, this.$options.data.call(this).queryParams)
      this.$emit('resetSearch', this.queryParams)
    },
    // 查询
    onSubmit () {
      this.$emit('search', this.queryParams)
    },
    goAdd () {
      this.$router.push({
        name: 'addManage',
        query: {
          taskType: this.taskType
        }
      })
    }
  }
}
</script>

<style scoped lang="scss">
</style>
